<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="full-screen" content="yes">
    <meta name="x5-fullscreen" content="true">
    <meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no">
    <link rel="stylesheet" href="../../css/base.css">
    <link rel="stylesheet" href="../../css/icon-font.css"/><!--图标-->
    <link rel="stylesheet" href="../../css/info-list.css"/><!--资讯列表-->
    <link rel="stylesheet" href="../../plugin/mescroll/css/mescroll.min.css">

    <title>行业</title>
    <style>

        .industry-topic-item {
            padding: 0 0.32rem 0.36rem 0.32rem
        }

        .industry-topic-item img {
            width: 100%;
            height: 3.16rem;
            border-radius: 4px;
        }
    </style>
</head>
<body>

<div class="flex-column h-100-p bg-white">
    <!--状态栏-->
    <div class="placeholder-top flex-column">
        <!--状态栏-->
        <div class="status-bar"></div>
        <!--标题栏-->
        <div class="nav-bar flex-row justify-content-between c-white align-items-center">
            <div class="left-bar" onclick="clickBack()">
                <span class="iconfont iconfanhui1 fs16"></span>
            </div>
            <div class="center-bar fs16 ff500 line1">投研深度专题</div>
            <div class="right-bar">
            </div>
        </div>
    </div>
    <div class="flex-1 scoll-y mt10" id="mescroll">
        <div class="industry-topic-wrap"></div>
    </div>

</div>


</body>
<!--这四个文件的引入必须按照顺序-->
<script src="../../js/dict.js"></script>
<script src="../../js/jquery-3.4.1.min.js"></script>
<script src="../../js/checkJsBridge.js"></script>
<script src="../../js/utils.js"></script>
<!--这四个文件的引入必须按照顺序-->
<script src="../../js/date.js"></script>
<script src="../../js/api.js"></script>
<script src="../../js/icon-font.js"></script><!--用于彩色字体图标-->
<script src="../../js/template.js"></script>
<script src="../../plugin/mescroll/js/mescroll.min.js"></script>

<script>
  let pm = {
      pageNum: 1,
      pageSize: 10,
      isScroll: true,
      title: '',
    },
    topicList = [{type: 0, img: '../../images/research/hy1.png'},
      {type: 1, img: '../../images/research/hy2.png'}, {type: 2, img: '../../images/research/hy3.png'},
      {type: 3, img: '../../images/research/hy4.png'}, {type: 4, img: '../../images/research/hy5.png'}]

  function initPage(params) {
    //状态栏自适应
    Utils.sbhAdaptive()

    loadTopic()

    //下拉刷新、滚动加载
    //meScroll = Template.createMeScroll({
    //  id: 'mescroll', //区域ID
    //  pageNum: 1,
    //  downCallback: loadTopic, //下拉刷新入口
    //  upCallback: '' //滚动加载入口
    //})
  }


  function reLoadPage(){
    $('.industry-topic-wrap').html('')
    loadTopic()
  }

  function loadTopic() {
    Server.researchIndex.getIndustryTopicList({
      pageSize: 5,
      pageNum: 1
    }).then(function (data) {
      data.list.forEach(function(item,index){
        $('.industry-topic-wrap').append(' <div class=\'industry-topic-item\'><img src=\'' + item.detailImgUrl + '\' onclick=\'jumpIndustryDetail("' + index + '")\'  /></div>')
      })
    })

  }

  function jumpIndustryDetail(index) {
    if (index < 3) {
      jsBridge.openWindow('html/research/industry.html?type=' + (parseInt(index) + 100),{}, {noBar: false})
    } else {
      jsBridge.openWindow('html/comment/no-power.html?title=行业',{}, {noBar: false})
    }

  }

</script>
</html>
